<template>
  <div class="table-form-body-button">
    <el-row>
      <span
        v-for="item in operateInfo"
        :key="item.btnName"
        class="btn-operate-above"
        :sapn="2"
      >
        <el-button
          v-if="item.location == '2' && item.btnType != 'import'"
          :type="item.cssType || 'default'"
          @click="item.method"
        >
          {{ item.name }}
        </el-button>
        <el-upload
          v-if="item.btnType == 'import'"
          ref="upload"
          :headers="headers"
          class="device-upload"
          :show-file-list="false"
          :action="importUrl()"
          :on-success="uploadSuccess"
          :auto-upload="true"
        >
          <el-button>批量导入</el-button>
        </el-upload>
      </span>
    </el-row>
  </div>
</template>
<script>
import waves from "@/directive/waves"; // waves directive
import Cookies from "js-cookie";
const Auth = Cookies.get("Admin-Token");
export default {
  name: "ListOpearteButton2",
  directives: { waves },
  props: ["dataLocation"],
  data() {
    return {
      headers: { Authorization: "Bearer " + Auth },
      operateInfo: [],
    };
  },
  watch: {},
  mounted() {
    console.log(this.$store.state.button.currentMenuButton);
    this.operateInfo = this.$store.state.button.currentMenuButton.filter(
      (e) => {
        return e.location == "2";
      }
    );
  },
  methods: {
    importUrl() {
      const { fullPath } = this.$route;
      const dataUrl = {
        "/device-basic/index": "/device/api/deviceAsset/import",
        "/plant-check/program": "/check/api/check/item/import",
        "/device-patrol/program": "/patrol/api/patrol/item/import",
        "/supply/index": "/device/api/deviceProduct/import",
        "/device-preserve/program": "/preserve/api/preserveItem/import",
      };
      return dataUrl[fullPath];
    },
    uploadSuccess(e) {
      console.log(e, "上传成功");
      if (!e || !e.data) {
        return;
      }
      const message = `成功导入${e.data.successes}条,失败${e.data.fails}条`;
      this.$alert(message, "导入结果", {
        confirmButtonText: "确定",
        callback: (action) => {
          this.$emit("importSuccess");
        },
      });
    },
  },
};
</script>
<style>
.btn-operate-above {
  margin: 0 10px;
}
.device-upload {
  display: inline-block;
}
</style>
